<template>
	<view class="main">
		<ul>
			<li v-for="(item,index) in list" :key="index">
				<view class="header">
					<h3>{{item.name}}</h3>
					<p>{{item.createtime}}</p>
				</view>
				<view class="con">
					{{item.intro}}
				</view>
				<view class="fn" @tap="routerTo(`/pages/pageB/information/infoDetail?id=${item.id}`)">
					<view>查看详情</view>
					<image src="@/static/img/right.png" mode=""></image>
				</view>
			</li>
		</ul>
	</view>
</template>

<script>
	import {
		Document
	} from '@/api/user.js'
	export default{
		data(){
			return{
				list:[]
			}
		},
		onLoad() {
			this.getList()
		},
		methods:{
			async getList(){
				let res = await Document()
				console.log(res)
				this.list = res.data.data
			},
			routerTo(url){
				uni.navigateTo({
					url:url
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.main{
		min-height: calc(100vh - 44px);
		background-color: #F2F2F2;
		padding: 10px 15px 10px;
		ul{
			width: 100%;
			li{
				width: 100%;
				padding: 20px 15px 10px;
				background-color: #fff;
				border-radius: 4px;
				margin-bottom: 10px;
				.header{
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-bottom: 15px;
					h3{
						color: #232323;
					}
					p{
						font-size: 11px ;
						color: #999999;
					}
				}
				.con{
					width: 100%;
					margin-bottom: 8px;
					font-size: 14px;
					color: #666666;
					overflow:hidden;
					text-overflow: ellipsis;
					-webkit-line-clamp: 3;
					display: -webkit-box;
					-webkit-box-orient: vertical;
				}
				.fn{
					width: 100%;
					display: flex;
					justify-content: space-between;
					align-items: center;
					font-size: 12px;
					color: #3D3D3D;
					padding-top: 8px;
					border-top: 1px solid #E4E4E4;
					image{
						width: 12px;
						height: 12px;
					}
				}
			}
		}
	}
</style>